import * as echarts from 'echarts';
import {watchEffect } from 'vue';
import {chartResize} from '@/views/dataBoard/compNew/ut';

const Comp = (props: any) => {
  const {id, data, key} = props;
  watchEffect(
    () => {
      const _data = data.value[key];
      const myChart = echarts.init(document.getElementById(id) as any);
      if (_data) {
        const option: any = {
          series: [
            {
              name: '上月用水',
              type: 'pie',
              center:['50%', '50%'],
              label: {
                show: false,
              },
              labelLine: {
                show: false,
              },
              data: _data.map((item) => {
                return {
                  name: item.classifyName,
                  value: item.value
                }
              }),
            },
          ],
        };
        myChart.setOption(option);
      }
      chartResize(myChart);
    },
    {
      flush: 'post',
    },
  );
};

export default Comp;
